<template>
	<view class="main">
		<view v-if="arrInfo.length">
			<view class="taps" v-for="i in arrInfo">
				<view class="label" :class="{ bgc: i.state == 2}">
					{{i.state == 1? '吃药':'事务'}}
				</view>
				<view class="title">
					{{i.incidentName}}
				</view>
				<view v-if="i.state == 1" class="text1">
					<view v-if="i.mornAffair" class="textSon">
						<text>时间：</text>
						{{i.mornAffair}}
						<text>{{$getTime.getTime(i.mornAffair)}}{{$getTime.getHms(i.mornAffair)}}</text>
					</view>
					<view v-if="i.noonAffair" class="textSon">
						<text>时间：</text>
						<text>{{$getTime.getTime(i.noonAffair)}}{{$getTime.getHms(i.noonAffair)}}</text>
					</view>
					<view v-if="i.nightAffair" class="textSon">
						<text>时间：</text>
						<text>{{$getTime.getTime(i.nightAffair)}}{{$getTime.getHms(i.nightAffair)}}</text>
					</view>
				</view>
				<view v-else-if="i.state == 2" class="text2">
					<view class="textSon">
						<text>时间：</text>
						<text>{{$getTime.getTime(i.mornAffair)}}{{$getTime.getHms(i.mornAffair)}}</text>
					</view>
				</view>
			</view>
		</view>
		<view v-else style="text-align: center;">
			<image src="http://1.12.49.243/state/myData/notData.svg" mode=""></image>
			<view>
				暂无信息
			</view>
		</view>
	</view>
</template>

<script>
export default {
	async onLoad(plo) {
		let code = JSON.stringify("'" + uni.getStorageSync('openid') + "'")
		let {data: res} = await this.$http.get('/getSubscribe', {params: { phone: code }})
		this.arrInfo.push(...res)
		console.log(this.arrInfo);
	},
	data () {
		return {
			arrInfo: []
		}
	}
}
</script>

<style lang="scss" scoped>
	.main {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		padding: 10rpx;
		.taps {
			position: relative;
			width: 90%;
			padding: 20rpx 20rpx 30rpx 20rpx;
			border-radius: 10rpx;
			background-color: #fffcfc;
			box-shadow: 0rpx 2rpx 4rpx rgba(222, 197, 197, 0.5),
									0rpx 3rpx 6rpx rgba(249, 196, 196, 0.5);
			margin: 20rpx 0 40rpx 0;
			.title {
				font-weight: 700;
				padding: 0rpx 10rpx 10rpx 0rpx;
				margin: 10rpx 0;
				font-size: 40rpx;
			}
			.label {
				position: absolute;
				right: 20rpx;
				top: -16rpx;
				width: 85rpx;
				height: 40rpx;
				background-color: #1989fa;
				border-radius: 8rpx;
				color: #fff;
				font-size: 28rpx;
				text-align: center;
			}
			.bgc {
				background-color: #ff976a;
			}
			.textSon {
				display: flex;
				justify-content: space-between;
			}
			.text1>view {
				margin-bottom: 10rpx;
			}
		}
	}
</style>